<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html> 
<head>
<%@ include file="../../include/easyui.jsp" %>
<%@ include file="../../include/pForm.jsp" %>
<%@ include file="/WEB-INF/jsp/include/easyui-layui-upload.jsp" %>
<script src="/plug-in/jquery-easyui-1.5.1/plugins/jquery.choosebox.js"></script>
<script type="text/javascript" src="/plug-in/jquery-easyui-1.5.1/plugins/datagrid-cellediting.js"></script>
<title>工程支出流程处理页面</title>
<script>
	$(function(){
		var expenseNo = '${expenseNo}' ;
		var _data = {'expenseNo': expenseNo};
		if(expenseNo){
			var param = {'expenseNo': expenseNo ,'expenseNo_searchType':'eq'};
			$.getJSON('/console/com.fs.jzzn.pojo.Expense/json', param , function(obj){
				if(obj){
					_data = obj;
					fn.loadData(obj);
				}
			}); 
		}
		
		fn.readOnly();
		
		$('#comment').textbox('readonly',false);
		
		$("#dataGrid").datagrid({
			idField: "id",
			rownumbers: true,
			pagination: true,
			singleSelect: true, 
			showFooter: true,
			fitColumns:true,
			nowrap:false,
			url : '/console/com.fs.jzzn.pojo.ExpenseItem/list',
			queryParams: {
				expenseNo :_data.expenseNo,
				expenseNo_searchType: "eq"
			},
			columns : [[
			    	 {field: 'costUser', title: '支出对象', width: 60 }
			    	 ,{field: 'remark', title: '标题说明', width: 200 }
				    ,{field: 'costType', title: '类别', width: 80}
			    	,{field: 'money', title: '金额(元)', width: 80 }
			    	,{field: 'billsNo', title: '凭单号', width: 100 }
			    	,{field: 'pNo', title: '路段编号', width: 90 }
			    	,{field: 'department', title: '关联项目部', width: 130 }
			    	,{field: 'costDate', title: '日期', width: 100 }
			]],
			onLoadSuccess:function(){
				childTotal();
			},
			onAfterEdit:function(index, row, changes){
				$.each(['remark','costType','billNo'], function (i,item) {
					$("td[field="+ item +"] div").tooltip({ content: function(){ return $(this).text(); } });
				});
				var dData = $('#dataGrid').datagrid('getData');
				var total = {money: 0, costType: '合计：'};
				$.each(dData.rows ||[], function (i,item) {
					total.money += parseFloat(item.money || '0');
				});
				total.money = total.money.toFixed(2);
				
				$('#dataGrid').datagrid('reloadFooter',[ total ]);
			}
			/*,
			toolbar: [{
				iconCls: 'icon-add', text: '添加', handler: function(){
					 $('#dataGrid').datagrid('appendRow',{money:0});
				}
			},'-'
			,{
				iconCls: 'icon-help',text: '帮助', handler: function(){
					$.messager.show({ title:'温馨提示', msg: '点击添加按钮，添加支出明细!',timeout:3000, showType:'slide' });
				}
			}]*/
		});//.datagrid('enableCellEditing');
		
		/*表单提交前动作*/
		fn.onBeforeSubmitForm = function(){
			var rows = $("#dataGrid").datagrid('getRows') ;
			$("input[name=childJson]").val(JSON.stringify(rows));
		};
		
		setTimeout(function(){
			//$("label[for=_easyui_textbox_input3]").css({"line-height":"60px"});
		},500);
	});
	
	function childTotal(){
		var dData = $('#dataGrid').datagrid('getData');
		var total = {money: 0, costType: '合计：'};
		$.each(dData.rows ||[], function (i,item) {
			total.money += parseFloat(item.money || '0');
		});
		total.money = total.money.toFixed(2);
		$('#dataGrid').datagrid('reloadFooter',[ total ]);
	}
	
	function deleteRow(index){
		$("#dataGrid").datagrid('deleteRow',index) ;
	}
</script>
</head>
<body>
	<div class="easyui-panel" data-options="fit:true,border:false" style="padding:10px;width:100%;">
		<!-- 替换自动form表单 -->
		<form id="easyuiForm" method="post" action="/console/expense/rewrite/submitTask"  style="min-width: 800px;width:100%;"  >
		 <!--类名属性及默认主键id-->
		 <input type="hidden" name="createrId" value="${SESSION_USER.user.id}" />
		 <input type="hidden" name="childJson" value="[]" >
		 <input type="hidden" name="id" value="" />
		 <input type="hidden" name="orgNo" value="" />
		 <input type="hidden" name="status" value="" />
		 <input type="hidden" name="taskId" value="${param.taskId}" />
		 
		 <div style="margin-bottom:20px">
		  	<input  class="easyui-textbox"  name="expenseNo" style="width:260px;"  readonly="readonly" data-options="label:'单据编号:',required:true,prefix:'ZC',timestamp:'yyMMddHHmmss' "/>
		  	<input class="easyui-textbox easyui-validatebox" id="applyDate" name="applyDate" style="width:260px;" data-options="label:'申请日期:',required:true" />
		  	<input class="easyui-textbox easyui-validatebox" name="pm"  value="${SESSION_USER.user.nickName}" style="width:260px;" data-options="label:'申请人:',required:true,validType:'length[0,15]'" />
		 </div>
		 
		  <div style="margin-bottom:20px">
		 		<select class="easyui-combobox"   name="department" style="width:260px;" data-options="label:'关联项目部:',required:true,loadFilter:fn.departmentFilter" 
					url="/console/combobox?valueField=dicName&textField=dicName&modleName=dictionary&pCode=A5&pCode_searchType=eq" >
		    	</select>
		    	<select class="easyui-combobox" name="contractName" style="width:520px;" data-options="label:'合同名称:'" 
					url="/console/contract/combobox?textField=contractName&valueField=contractName" >
			   </select>
		  	</div>
		  	
		 	<div style="margin-bottom:20px">
		 		<input class="easyui-textbox easyui-validatebox" name="remark" multiline="true" style="width:780px;height:100px;" data-options="label:'备注:',required:false,validType:'length[0,500]'" />
		 	</div>
		 
		 <div style="margin-bottom:20px">
		 		<input class="easyui-layuiupload" name="attachment" style="width:780px;" data-options="label:'附件:',upload:{auto:false,height:150,readonly:true}" />
		 </div>
		 
		 <!-- 支付明细 -->
		 	<div style="margin-bottom:20px;margin-left: 80px;">
				<table id="dataGrid" title="支付明细" style="height:260px;width:85%;"></table>
			</div>
			
			<!-- 流程批注及提交处理 -->
		 	<%@ include file="/WEB-INF/jsp/include/process-submit.jsp" %>
			
		</form>
	</div>
</body>
</html>